<!DOCTYPE html><html lang=en><head><meta charset=UTF-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><title>购物车</title><link rel=stylesheet href=../css/gowuche.css><link rel=stylesheet href=../css/style.css></head><body><div class=site_mini_header><div class="container w"><div class=header-logo><a href=index.html><img src=../img/1.jpg alt="" width=48></a></div><div class=header-center><h2>我的购物车</h2><p>温馨提示：产品是否购买成功，以最终下单为准哦，请尽快结算</p></div><div class=herder-right><span>我的订单</span> | <span>用户名</span></div></div></div><div class="page-main w"></div><div class="close w"><div class=close-num><span>合计: <em>0</em> 元 </span><a href=# class=goclose>去结算</a></div></div><script src=../node_modules/jquery/dist/jquery.js></script><script>// 修改商品数量
        //增加
        $(".page-main").on('click','.sub',function(){
            var id = $(this).parents('.list-item').children().eq(0).text();
            $.ajax({
                url:'http://localhost/src/interface/update.php',
                data:{
                    id:id,
                    type:'sub'
                },
                success:function(res){
                        if(res.code==1){
                            show()
                    }
                },
                dataType:'json'
            })
        })
        //减小
        $(".page-main").on('click','.add',function(){
            var id = $(this).parents('.list-item').children().eq(0).text();
            $.ajax({
                url:'http://localhost/src/interface/update.php',
                data:{
                    id:id,
                    type:'add'
                },
                success:function(res){
                    if(res.code==1){
                        show()
                    }
                },
                dataType:'json'
            })
        })

        //删除商品
        $('.page-main').on('click','.deltel',function(){
            var id = $(this).parents('.list-item').children().eq(0).text();
            $.ajax({
                url:'http://localhost/src/interface/del.php',
                data:{
                    id:id
                },
                success:function(res){
                    if(res.code===1){
                        show();
                    }
                },
                dataType:'json'
            })
        })
        show()
        // 展示购物车数据
        async function show(){
            await $.ajax({
            url:'http://localhost/src/interface/showlist.php',
            success:function(res){
                // console.log(res)
                $('.page-main').html(`<div class="list-head bor">
                    <div class="co-checked">
                        <input type="checkbox" class="inputes" id='btn'>
                        全选
                    </div>
                    <div class="col-img clearfix"></div>
                    <div class="col-name">
                        商品名称
                    </div>
                    <div class="col-price">
                        单价
                    </div>
                    <div class="col-num">
                        数量
                    </div>
                    <div class="col-total">
                        小计
                    </div>
                    <div class="col-action">
                        操作
                    </div>
                </div>`)
                if(res.code==1){
                    res.data.forEach(function(val){
                        $(".page-main").append(`<div class="list-item bor">
            <div id="idsb" style="display: none;">${val.product_id}</div>
            <div class="co-checked">
                <input type="checkbox" class="inputes" id="btn1">
            </div>
            <div class="col-img clearfix">
                <img src="${val.product_img}" alt="">
            </div>
            <div class="col-name">
                <h3>${val.product_name}</h3>
            </div>
            <div class="col-price">
                <span>${val.product_price}元</span>
            </div>
            <div class="col-num">
                <div class="change">
                    <a href="#" class="add">-</a>
                    <input type="text" value="${val.product_num}" disabled id='inputs'>
                    <a href="#" class="sub">+</a>
                </div>
            </div>
            <div class="col-total">
                <p class="col-pri">${val.product_price*val.product_num}元</p>
            </div>
            <div class="col-action">
                <a href="#" class="deltel">删除</a>
            </div>
        </div>`)
                    })
                }
            },
            dataType:'json'
        })
        
       
    }</script></body></html>